/****** Globals **********/
body{font-family:Arial;font-size:0.85em;margin:0;padding:0;}
a{text-decoration:none;}
a:hover{text-decoration:underline;}
/*** Top Bar ***/
#topBar{height:26px;background:#115c96; }
#topLinks{color:#fff;font-size:0.9em;text-align:right;width:940px; margin:auto;padding:5px;}
.offscreen, .offScreen {position: absolute;left: -9999px; }
#skipNavigation {position: absolute;left: -9999px; }

/****** Navigation CSS ********/
#navbar{height:47px;width:960px;overflow:hidden;border-bottom: solid 1px #50a097;}
#navbar ul{height:50px;margin:0;padding:0;}
#navbar ul li{text-align:center;height:47px;list-style:none;display:inline-block;margin:0;padding:0;float:left;border-left:solid 1px #51b4a3;border-right:solid 1px #004f42;}
#navbar ul li.first{border-right:solid 1px #004f42;border-left:0;}
#navbar ul li.last{border-left:solid 1px #51b4a3;border-right:0;}
#navbar ul li a{display:inline-block;width:auto;padding:8px;font-size:0.95em;text-decoration:none;color:#fff;text-align:center;height:30px;}
#navbar ul li a:hover{display:inline-block;width:auto;padding:8px;font-size:0.95em;text-decoration:none;color:#fff;text-align:center;height:30px;}
.roads_trans_en{width:128px;}
.env_water_en{width:120px;}
.garbage_recycle_en{width:120px;}
.rec_culture_en{width:125px;}
.health_safety_en{width:116px;}
.social_com_en{width:145px;}
.licence_permit_en{width:129px;}
.city_hall_en{width:63px;}

.roads_trans_fr{width:118px; }
.env_water_fr{width:120px;}
.garbage_recycle_fr{width:120px;}
.rec_culture_fr{width:105px;}       
.health_safety_fr{width:106px;}
.social_com_fr{width:175px;}
.licence_permit_fr{width:119px;}
.city_hall_fr{width:83px;}

ul.navLinks {margin:0;padding:0}
ul.navLinks li{list-style:none;display:inline;}
ul.navLinks.whiteLinks li a{color:#fff;}
ul.navLinks.grayLinks li a{color:#363636;}
.sepLine{padding-left:5px;padding-right:5px;}

/*** Wrapper Elements ***/
#wrappper{width:960px;margin:auto;}
#header{width:960px;height:60px;margin-top:20px;margin-bottom:20px;}
#landingContent{padding:0px 10px 10px 10px;background:#fff;width:620px;float:left; min-height: 330px;}
#contentWrapper{width:960px;}

/*** Content Page Elements ***/
#serviceLevelLeftColumn {float: left;margin: 0;padding: 0;width: 180px;}
#leftNav {border-right: 1px solid #FFFFFF;margin: 0;padding: 0;text-align: left;width: 180px;}
#leftNav ul#navlist {border: medium none;list-style-type: none;margin: 0.25em 0;padding-left: 0;}
#leftNav ul#navlist a.navHead {background-color: #00524A;border-bottom: 1px solid #FFF;color: #FFF;font: 0.95em Arial,Helvetica,sans-serif;margin: 0;padding: 4px 5px;width: 170px;}
#leftNav ul#navlist li {margin: 0;padding: 0;}
#leftNav ul#navlist a {background-color: #008A7C;border-bottom: 1px solid #FFF;color: #FFF;display: block;font-size: 0.9em;margin: 0;padding: 3px 5px;text-decoration: none;width: 170px;}
#leftNav ul#navlist a:hover {background-color: #007165;}
#serviceLevelLeftColumn #relatedLinks {background-color: #ddd; border-bottom: medium none; margin: 1em 0; padding: 0; font-size: .95em;}
#serviceLevelLeftColumn #relatedLinks strong.RLHeader {display: block; padding: 5px; background: #1e468d; color: #fff; font-weight: normal;}
#serviceLevelLeftColumn #relatedLinks ul {margin: 0;padding: 0; list-style: none;}
#serviceLevelLeftColumn #relatedLinks li {margin: 0;padding: 0;}
#serviceLevelLeftColumn #relatedLinks a {border-bottom: 1px solid #fff; display: block; color: #000; padding: 4px; text-decoration: none;}
#serviceLevelLeftColumn #relatedLinks a:hover {background: #325797; color: #fff;}
#serviceLevelLeftColumn #relatedLinks p {border-top: 1px solid #FFFFFF;color: #000000;margin: 0;padding: 0.25em; font-size: 0.90em;}
#serviceLevelTextArea{float:left; padding: 0px 10px 10px 10px;font-size:0.9em;width:750px;}
#noLeftNav #serviceLevelTextArea{padding: 0px 8px 8px 8px;width:944px;}
#serviceLevelTextAreaSiteMap{font-size:0.9em;margin: 0px;padding: 10px 10px 10px 10px;width:940px;}
#serviceLevelTextAreaSiteMap h1 {font-size: 1.8em;margin:0 0 1em 0;}
#serviceLevelTextAreaSiteMap h2 {font-size: 1.4em;margin:0 0 1em 0;}
#serviceLevelTextAreaSiteMap .sitemapSection {width: 300px; float: left; padding: 5px;}
.adSpace{float:left; width:170px;padding-left:10px;}
.adBorder{border-right:dashed 1px #ccc;width:570px!important;}
#serviceLevelTextArea h1 {font-size: 1.8em;margin:0 0 1em 0;}
#serviceLevelTextArea h2 {font-size: 1.4em; margin: 1em 0 .5em 0;}
#serviceLevelTextArea h3 {font-size: 1.2em;margin: 1em 0 .5em 0;}
#serviceLevelTextArea h4 {font-size: 1em;margin: 1em 0 .5em 0;}
#serviceLevelTextArea h5 {font-size: 1em;margin: 1em 0 .5em 0; font-style: italic;}

#serviceLevelTextArea ul {list-style-type: disc; margin: .25em 0 1em 1.5em; padding: 0; }
#serviceLevelTextArea ul ul {list-style-type: circle;}
#serviceLevelTextArea ul ul ul {list-style-type: square;}
#serviceLevelTextArea ol ol {list-style-type: lower-alpha;}
#serviceLevelTextArea ol ol ol {list-style-type: lower-roman;}
#serviceLevelTextArea blockquote{font-style:italic; margin-top: -0.95em; font-size: 0.95em;}
#serviceLevelTextArea a{color:#008476;text-decoration:none;}
#serviceLevelTextArea a:hover{color:#008476;text-decoration:underline;}
#breadcrumb a.breadcrumb, a.breadcrumb:visited, div.homeLink a {color: #008476;}
#breadcrumb a.breadcrumb:hover, div.homeLink a:hover {color: #008476;text-decoration: none;}
#breadcrumb a.breadcrumb:active, div.homeLink a:active {color: #000000;font-weight: bold;}
#breadcrumb {font-size: 0.9em;}
#breadcrumb{padding:0px 8px 8px 8px;}
#breadcrumb ul{margin:0;padding:0;}
#breadcrumb ul li{margin:0;list-style:none;display:inline;padding:0;}
#breadcrumb ul li a{color:#008476;}
#contentID {float: right; color: #999; font-size: 0.90em;}
.graphicRight, .graphicLeft, .graphicCenter {text-align: center; padding: 0; margin: 0;}
.graphicRight {	float: right;	margin: .5em;	text-align: center;}
.graphicLeft {	float: left;	margin: .5em;	margin-left: 0;	text-align: left;}
.graphicCenter {display: block; margin: .5em 0; }
.smallFont {font-size: 0.80em;}

.textBoxLeft, .textBoxRight, .textBoxCenter {background: #F7FBFB; border: 1px solid #8BBCB7; padding: .25em; width: 20%; border-radius: 5px;}
.textBoxLeft, .textBoxRight { min-width: 150px; max-width: 220px; }

.textBoxLeft img, .textBoxRight img {max-width: 200px;}
.textBoxLeft {
	float: left;
	margin: .25em .5em .25em 0 ;
}

.textBoxRight {float: right; margin: .25em 0 .25em .5em;}

.textBoxLeft p {
	margin-top: 0;
	margin-bottom: .5em;
}

.textBoxCenter {
	display: block;
	width: 75%; 
	margin: 1em 10%;  
}


/*** Logan Testing Tables, May 14th 2012 ***/
#serviceLevelTextArea span.textBoxCenter table {width: 100%; background: #fff; border: 1px solid #90f; border-collapse: collapse;}
#serviceLevelTextArea span.textBoxCenter table th { background: #c39; color: #fc0;  }
#serviceLevelTextArea span.textBoxCenter table th, #serviceLevelTextArea span.textBoxCenter table td { border-color: red; }

#serviceLevelTextArea span.textBoxLeft table {width: 100%; background: #fff; border: 1px solid red; border-collapse: collapse;}
#serviceLevelTextArea span.textBoxLeft table th { background: #000; color: #fff;  }

/*** End Logan Testing Tables, May 14th 2012***/



/*** Right Hand Links and Ad Space Definition ***/
.addSpace{float:right;width:169px;padding:10px; margin-left: 20px; position:relative; top:0px; border-left: dashed 1px #ccc; padding-bottom: 15px; }
#rightHandLinks h2{font-size: 1.4em; color: #fff; background-color: #008477; padding-top: 5px; padding-bottom: 5px; padding-left: 3px; }
#rightHandLinks h2 a:hover {color: #ccc}
#rightHandLinks h2 a:link {text-decoration: underline; color: #fff}
#rightHandLinks h2 a:visited {color: #fff}
#rightHandLinks h2 a:active {color: #ccc}


/*** Header Elements ***/
#banner{margin-bottom:10px;}
span.customStyleSelectBox {height:20px;font-size:0.95em; font-family:Arial;color:#000;padding-top:2px;}
span.customStyleSelectBox.changed {background-color: #fff; }

/*** Footer Elements ***/
#footer {position:relative;bottom:-1px;height:200px;background:#ddd;border-top:solid 6px #f5f5f5;}
#innerFooter{width:960px;margin:auto; padding-top:40px;}
#socialMedia_en{float:left;margin-right:150px;}
#socialMedia_fr{float:left;margin-right:150px;}
#footerNav{float:right;text-align:right;color:#363636;font-size:0.9em;}
.marginTopSeven{margin-top:8px!important;}
.marginTopFifty{margin-top:50px}
#google_translate_element{float:left;margin-top:-5px}
#homeLogo{float:left;margin-left:20px;}
#otherSites{float:left;margin-right:30px;}
#googleSearch{float:left;}
#searchItems{float:right;margin-top:33px;}
.textBox{background:#fff;border:solid 1px #999;padding:2px;float:left;height:20px;width:200px}
.searchButton{border:none;padding:5px;cursor:pointer;}
.styledButton{border:none;padding:3px;font-weight:bold;color:#fff;height:26px;width:28px;cursor:pointer;}
.transInputText{border:none;background:none;font-size:0.95em;width:196px;}
a.socialMedia{display:inline-block;width:32px;height:32px;text-decoration:none;margin-right:8px;}


/****** Rounded Corner Classes ********/
.roundedLeft{-moz-border-radius: 8px 0px 0px 0px;-webkit-border-radius: 8px 0px 0px 0px;border-radius: 8px 0px 0px 0px;}
.roundedRight{-moz-border-radius: 0px 8px 0px 0px;-webkit-border-radius: 0px 8px 0px 0px;border-radius: 0px 8px 0px 0px;}
.roundedBottomRight{-moz-border-radius: 0px 0px 8px 0px;-webkit-border-radius: 0px 0px 8px 0px;border-radius: 0px 0px 8px 0px;}
.roundedBottomLeft{-moz-border-radius: 0px 0px 0px 8px;-webkit-border-radius: 0px 0px 0px 8px;border-radius: 0px 0px 0px 8px;}
.roundedBottomLeftSmall{-moz-border-radius: 0px 0px 0px 6px;-webkit-border-radius: 0px 0px 0px 6px;border-radius: 0px 0px 0px 8px;}
.roundedBottomBoth{-moz-border-radius: 0px 0px 8px 8px;-webkit-border-radius: 0px 0px 8px 8px;border-radius: 0px 0px 8px 8px;}
.roundedEight{-moz-border-radius: 8px;-webkit-border-radius: 8px;border-radius:8px;}
.roundedNine{-moz-border-radius: 9px;-webkit-border-radius: 9px;border-radius:9px;}
.roundedThree{-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius:3px;}
.roundedThreeBothRight{-moz-border-radius: 0px 3px 3px 0px;-webkit-border-radius: 0px 3px 3px 0px;border-radius: 0px 3px 3px 0px;}
.roundedTopBoth{-moz-border-radius: 8px 8px 0px 0px;-webkit-border-radius: 8px 8px 0px 0px;border-radius: 8px 8px 0px 0px;}

/****** Misc ********/
.clearFix{clear:both;}
.onePixHigh{height:1px;}


/****** Gradient and Shaddow Classes **********/
.blueGradient{
	background-color: #004990;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4e8ecd), to(#004990));
	background: -webkit-linear-gradient(top, #4e8ecd, #004990);
	background: -moz-linear-gradient(top, #4e8ecd, #004990);
	background: -ms-linear-gradient(top, #4e8ecd, #004990);
	background: -o-linear-gradient(top, #4e8ecd, #004990);	
	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#4e8ecd',EndColorStr='#004990');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#4e8ecd',EndColorStr='#004990')";
	zoom: 1;
}

.darkGreenGradient{
	background-color: #006a5e;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#008273), to(#006a5e));
	background: -webkit-linear-gradient(top, #008273, #006a5e);
	background: -moz-linear-gradient(top, #008273, #006a5e);
	background: -ms-linear-gradient(top, #008273, #006a5e);
	background:  -o-linear-gradient(top, #008273, #006a5e);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#008273', endColorstr='#006a5e');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#008273',EndColorStr='#006a5e')";
	zoom: 1;
}
.greenGradient{
	background-color: #008476;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#00a290), to(#008476));
	background: -webkit-linear-gradient(top, #00a290, #008476);
	background: -moz-linear-gradient(top, #00a290, #008476);
	background: -ms-linear-gradient(top, #00a290, #008476);
	background:  -o-linear-gradient(top, #00a290, #008476);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00a290', endColorstr='#008476');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#00a290',EndColorStr='#008476')";
	zoom: 1;
}
.lightGreenGradient{
	background-color: #02c3ad;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#02c3ad), to(#009e8a));
	background: -webkit-linear-gradient(top, #02c3ad, #009e8a);
	background: -moz-linear-gradient(top, #02c3ad, #009e8a);
	background: -ms-linear-gradient(top, #02c3ad, #009e8a);
	background: -o-linear-gradient(top, #02c3ad, #009e8a);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#02c3ad', endColorstr='#009e8a');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#02c3ad',EndColorStr='#009e8a')";
	zoom: 1;
}
.grayGradient{
	background-color: #e2e2e2;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#e2e2e2));
	background: -webkit-linear-gradient(top, #ffffff, #e2e2e2);
	background: -moz-linear-gradient(top, #ffffff, #e2e2e2);
	background: -ms-linear-gradient(top, #ffffff, #e2e2e2);
	background: -o-linear-gradient(top, #ffffff, #e2e2e2);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e2e2e2');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff',EndColorStr='#e2e2e2')";
	zoom: 1;
}
.grayOuterGlow, .grayOuterGlowFilled {
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius:9px;
	-moz-box-shadow: 0px 0px 5px #999;
	-webkit-box-shadow: 0px 0px 5px #999;
	box-shadow: 0px 0px 5px #999;
	border:solid 1px #999;
}
.grayOuterGlowFilled{
	background:#fff;
}
.grayOuterGlowFilledSmall{
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius:6px;
	background:#fff;
	-moz-box-shadow: 0px 0px 5px #999;
	-webkit-box-shadow: 0px 0px 5px #999;
	box-shadow: 0px 0px 5px #999;
	border:solid 1px #999;
}
.whiteOuterGlow{
	-moz-box-shadow: 0px 0px 5px #fff;
	-webkit-box-shadow: 0px 0px 5px #fff;
	box-shadow: 0px 0px 5px #fff;
}

.whiteLine ul.boxItems { min-height: 350px;}



/*** Service Ottawa Related ***/
.serviceOttawaDiv{font-size:0.95em;color:#fff;}
.serviceOttawaDiv p{margin:20px 0px 20px 0px}
a.serviceOttawaLink{
	display:inline-block;height:24px;text-align:center;font-size:1em;color:#fff;padding-top:4px;padding-left:10px;padding-right:40px;float:left;
	border:solid 1px #014a8f;
	width:225px;
}
a.serviceOttawaLink:hover{
	text-decoration:none;
}

ul.serviceOttawaList{margin:0;padding:0;}
div.serviceOttawaListLeft{float:left;width:49%;margin-bottom:30px;}
div.serviceOttawaListRight{float:right;width:49%;margin-bottom:30px;}
ul.serviceOttawaList li{list-style:none;padding:1px 1px 5px 20px;color:#fff;}
ul.serviceOttawaList li a{color:#fff;}
.imageBox{width:102px;height:70px;float:left;margin-right:10px;}
a.imageBox{width:94px;height:62px;border:solid 4px #fff;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius:5px;display:inline-block;}
a.imageBox:hover{text-decoration:none;}


/**********************/
/*** for Org charts ***/

div#topOrg,	div#org {
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 1em;
}
div#topOrg {margin-left: 20px;}
ul#topLevel {background: none; }
ul#topLevel li {list-style: none;}
div#org ul#topLevel ul li {
 	list-style: none; 
	color: #000; 
	padding: 0 0 8px 25px; 
	border-left: 1px solid black;
}	
div#org ul#topLevel ul li.last {border-left: none;}	
div#org ul#topLevel ul {margin-top: 10px;}
div#org ul#topLevel ul ul {margin-top: 10px;}
div#org ul#topLevel ul, div#org ul#topLevel ul ul {
	border-left: none; 
	padding: 15px 0 0 5px; } 
#serviceLevelTextArea ul#topLevel li {
	margin-bottom: 0;
	margin-left:0;
}

/**********************************/
/* For main index Org Chart only */
/*********************************/

div.topStructulWrapper {
	display: block;
	width: 94%;
	text-align: center;
}
ul.topStruct {
	width: 600px;
	text-align: center;
	margin: 0 auto;
}
ul.topStruct li {
	list-style: none;
	width: 100%;
	margin:  0; 
	padding: 0;
}
ul.topStruct li div {
	border: 1px solid black;
	width: 170px;
	text-align: center;
	padding: .25em;
	margin: 0 auto;
}
ul.topStruct li.cm { padding-bottom: 43px; background: url(http://ottawa.ca/images/orgCharts/topStructure.png)center no-repeat;}
ul.topStruct li.audit {height: 40px;}
ul.topStruct li.audit div {
	float: left;
	margin: 5px 0 0 15px;
}	
div.list {
	float: left;
	margin: 0 3px;
	padding: 3px;
	width: 23%;
	border: 1px solid #999; 
}
#serviceLevelTextArea div.list h2 {
	background-color: #000;
	color: #fff;
	margin: 0 0 .5em 0;
	padding: .25em;
	font-size: 1em;
	text-align: center;
}		
#serviceLevelTextArea div.list h2 a {
	text-decoration: none;
	display: block;
}
#serviceLevelTextArea div.list h2 a:link, #serviceLevelTextArea div.list h2 a:visited {color: #fff;}
#serviceLevelTextArea div.list h2 a:hover {color: #ffcc00;}
ul.listOne a span {display: none;	} 
ul.listOne a:hover span {
	display: block;
	position: relative;
	left: 5px; 
	top: 5px;
	padding: 0; 
	margin: 0; 
	z-index: 100;
	}  
ul.listOne a, ul.listOne a:visited {
	text-decoration: underline; 
	width: auto;
	color: #000; }	
ul.listOne a:hover {text-decoration: none;}
ul.listOne li {padding-bottom: 10px;}	
ul.listOne li ul li {padding : 1px 0;}	
div.linkBack {
	font-size: .9em;
	display: block;
	clear: both;
	margin: 2.5em 20px;
}
div#topOrg ul#topLevel, div#org ul#topLevel {
	float: left; 
	padding-left: 20px;
}
div#org img {
 	float: left;
	margin: 50px 0 10px 20px;
 }
 
 
 /**** data table styles ****/
 /* styles for published pages */
 #serviceLevelTextArea table {border: 1px solid #8BBCB7; width: 650px; border-collapse: collapse; margin: 0;}
 #serviceLevelTextArea table caption {font-size: .9em; font-style: italic; text-align: right; margin: 1em 0; caption-side: bottom;}
 #serviceLevelTextArea table td, #serviceLevelTextArea table th {border: 1px solid #8BBCB7; padding: .25em .5em; }
 #serviceLevelTextArea table th {color: black; font-size: 1em; text-align: left;
 background: #D1E4E2; border-bottom-width: 2px; }
 #serviceLevelTextArea table p {margin: 0; padding: 0;}
 
 
/*Text box specific styles */ 
img.textBoxSize {max-width: 150px; max-height: 112px;}
.textBoxRight ul {margin: 0; padding: 0;}
.textBoxRight ul li {margin: 0 5px 0 15px;}
#serviceLevelTextArea .textBoxRight h2 {display: block; background: #008678; color: #fff; padding: 3px; font-size: 1.2em; margin: 0 0 .5em 0;}
#serviceLevelTextArea .textBoxRight p {margin: .25em 0;}

/*****^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^*****/
/***** new styles for Right Hand Links Div *****/
#rightHandElements{float:right;width: 210px;z-index: 1;margin-right:-20px;}

#rightHandLinks {
	float: right;
	width: 200px!important;
	border-top: 1px solid black;
	border-left: 2px solid black;
	border-bottom: 1px solid black;
	margin: 0 0 10px 10px;
	padding: 0;
	background-color: #f2f2f2;
	z-index: 1;
}
#rightHandLinks h1, #rightHandLinks h2, #rightHandLinks h3, #rightHandLinks h4, #rightHandLinks h5 {
	color: #fff;
	display: block;
	padding: .1em .25em;
	margin: 0;
	font-family: Tahoma, Geneva, sans-serif;
	font-style: normal;
}

#rightHandLinks h1, #rightHandLinks h2 {
	background-color: #464646;
	font-size: 1.1em;
}

#rightHandLinks h1 a, #rightHandLinks h2 a, #rightHandLinks h3 a, #rightHandLinks h4 a, #rightHandLinks h5 a {
	color: #fff;
	text-decoration: none;
}

#rightHandLinks h1 a:visited, #rightHandLinks h2 a:visited, #rightHandLinks h3 a:visited, #rightHandLinks h4 a:visited, #rightHandLinks h5 a:visited {
	color: #fff;
}

#rightHandLinks h1 a:hover, #rightHandLinks h2 a:hover, #rightHandLinks h3 a:hover, #rightHandLinks h4 a:hover, #rightHandLinks h5 a:hover {
	color: #fff;
}

#rightHandLinks h1 a:active, #rightHandLinks h2 a:active, #rightHandLinks h3 a:active, #rightHandLinks h4 a:active, #rightHandLinks h5 a:active {
	color: #fff;
}

#rightHandLinks h3, #rightHandLinks h4, #rightHandLinks h5  {
	background-color: #8B8B8B;
	font-size: 1.1em;
	margin-top: .5em;
}

#rightHandLinks p {
	color: #000;
	display: block;
	font-size: 1em;
	margin: 0;
	padding: .25em;
}

#rightHandLinks p a, #rightHandLinks p a:visited {
	color: #00c;
	text-decoration: underline;
}

#rightHandLinks p a:hover {
	color: #fff;
	text-decoration: none;
	background-color: #000;
}

#rightHandLinks ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	background-color: #f2f2f2;
	padding-bottom: .25em;
}

#rightHandLinks ul li {
	display: block;
	background-color: #f2f2f2;
	color: #000;
	padding: .25em;
	border-top: 1px solid white;
	margin-left: 0;
}
 
#rightHandLinks ul li a {
	text-decoration: none;
	display: block;
	padding-left: 10px;
	color: #000;
}

#rightHandLinks ul li a:visited {
	color: #000;
}

#rightHandLinks ul li a:hover {
	color: #fff;
	background-color: #000;
}

#rightHandLinks ul ul {
	border-top: 1px dotted #D1D1D1;
}



#rightHandLinks ul ul li {
	display: list-item;
	list-style: disc;
	margin: 0 0 0 25px;
	padding: 0;
	padding-bottom: .5em;
	border: none;
}

#rightHandLinks ul ul li a {
	color: #00c;
	text-decoration: underline;
	display: inline;
	margin: 0;
	padding: 0;
}

 
#rightHandLinks ul ul li a:hover {
	color: #fff;
	text-decoration: none;
	background-color: #000;
}

#rightHandLinks table {
	width: 100%;
	margin: 0;
	padding: 0;
	border: none;
	font-size: 1em;
} 
 

#rightHandLinks table tr {
	width: 100%;
	margin: 0;
	padding: 0;
} 

#rightHandLinks table tr td {
	width: 100%;
	padding: 0 .25em;
} 

#rightHandLinks table tr td h1, #rightHandLinks table tr td h2, #rightHandLinks table tr td h3, #rightHandLinks table tr td h4, #rightHandLinks table tr td h5 {
	display: block;
	margin: 0 -.25em;
} 



#rightHandLinks table ul  {
	margin-top: 0;
	margin-bottom: 0;
	background-color: #e8e8e8;
	list-style-type: disc;
	border: none;
} 

#rightHandLinks table li {
margin: 0 0 0 20px;
	display: list-item;
	background-color: #e8e8e8;
	border-bottom: 1px solid #E8E8E8;
	padding: 0;
} 

#rightHandLinks table li li {
margin: 0 0 0 15px;
	list-style-type: circle;
} 
 
#rightHandLinks table li li li {
margin: 0 0 0 15px;
	list-style-type: square;
} 

#rightHandLinks table li a { 
	display: inline;
	margin: 0;
	padding: 0;
	color: #00c;
	text-decoration: underline;
}

#rightHandLinks table a, #rightHandLinks table li a, #rightHandLinks table a:visited, #rightHandLinks table li a:visited {
	display: inline;
	color: #00c;
	text-decoration: underline;
}

#rightHandLinks table a:hover, #rightHandLinks table li a:hover {
	color: #fff;
	text-decoration: none;
	background-color: #000;
}

#rightHandLinks img {
	display: block;
	text-align: center;
	margin: auto;
	max-width:180px;
}
/***** new styles for Service Ottawa Right hand Div *****/
#soRightHandLinks {
	float: right;
	width: 200px;
	border-top: 1px solid #8BBCB7;
	border-left: 1px solid #8BBCB7;
	border-bottom: 1px solid #8BBCB7;
	margin: 0 0 10px 10px;
	padding: 60px 0 0 0;
	background-color: #E8F4F3;
	z-index: 2;
}
#soRightHandLinks h1, #soRightHandLinks h2, #soRightHandLinks h3, #soRightHandLinks h4, #soRightHandLinks h5 {
	color: #fff;
	display: block;
	padding: .1em .25em;
	margin: 0;
	font-family: Tahoma, Geneva, sans-serif;
	font-style: normal;
}

#soRightHandLinks h1, #soRightHandLinks h2 {
	background-color: #006C61;
	font-size: 1.1em;
}

#soRightHandLinks h1 a, #soRightHandLinks h2 a, #soRightHandLinks h3 a, #soRightHandLinks h4 a, #soRightHandLinks h5 a {
	color: #fff;
	text-decoration: none;
}

#soRightHandLinks h1 a:visited, #soRightHandLinks h2 a:visited, #soRightHandLinks h3 a:visited, #soRightHandLinks h4 a:visited, #soRightHandLinks h5 a:visited {
	color: #fff;
}

#soRightHandLinks h1 a:hover, #soRightHandLinks h2 a:hover, #soRightHandLinks h3 a:hover, #soRightHandLinks h4 a:hover, #soRightHandLinks h5 a:hover {
	color: #fff;
}

#soRightHandLinks h1 a:active, #soRightHandLinks h2 a:active, #soRightHandLinks h3 a:active, #soRightHandLinks h4 a:active, #soRightHandLinks h5 a:active {
	color: #fff;
}

#soRightHandLinks h3, #soRightHandLinks h4, #soRightHandLinks h5  {
	background-color: #8B8B8B;
	font-size: 1.1em;
	margin-top: .5em;
}

#soRightHandLinks p {
	color: #000;
	display: block;
	font-size: 1em;
	margin: 0;
	padding: .25em;
}

#soRightHandLinks p a, #soRightHandLinks p a:visited {
	color: #00c;
	text-decoration: underline;
}

#soRightHandLinks p a:hover {
	color: #fff;
	text-decoration: none;
	background-color: #000;
}

#soRightHandLinks ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	background-color: #f2f2f2;
	padding-bottom: .25em;
}

#soRightHandLinks ul li {
	display: block;
	background-color: #f2f2f2;
	color: #000;
	padding: .25em;
	border-top: 1px solid white;
	margin-left: 0;
}
 
#soRightHandLinks ul li a {
	text-decoration: none;
	display: block;
	padding-left: 10px;
	color: #000;
}

#soRightHandLinks ul li a:visited {
	color: #000;
}

#soRightHandLinks ul li a:hover {
	color: #fff;
	background-color: #000;
}

#soRightHandLinks ul ul {
	border-top: 1px dotted #D1D1D1;
}

#soRightHandLinks ul ul li {
	display: list-item;
	list-style: disc;
	margin: 0 0 0 25px;
	padding: 0;
	padding-bottom: .5em;
	border: none;
}

#soRightHandLinks ul ul li a {
	color: #00c;
	text-decoration: underline;
	display: inline;
	margin: 0;
	padding: 0;
}

#soRightHandLinks ul ul li a:hover {
	color: #fff;
	text-decoration: none;
	background-color: #000;
}

#soRightHandLinks table {
	width: 100%;
	margin: 0;
	padding: 0;
	border: none;
	font-size: 1em;
} 
 
#soRightHandLinks table tr {
	width: 100%;
	margin: 0;
	padding: 0;
} 

#soRightHandLinks table tr td {
	width: 100%;
	padding: 0 .25em;
} 

#soRightHandLinks table tr td h1, #soRightHandLinks table tr td h2, #soRightHandLinks table tr td h3, #soRightHandLinks table tr td h4, #soRightHandLinks table tr td h5 {
	display: block;
	margin: 0 -.25em;
} 

#soRightHandLinks table ul  {
	margin-top: 0;
	margin-bottom: 0;
	background-color: #e8e8e8;
	list-style-type: disc;
	border: none;
} 

#soRightHandLinks table li {
margin: 0 0 0 20px;
	display: list-item;
	background-color: #e8e8e8;
	border-bottom: 1px solid #E8E8E8;
	padding: 0;
} 

#soRightHandLinks table li li {
margin: 0 0 0 15px;
	list-style-type: circle;
} 
 
#soRightHandLinks table li li li {
margin: 0 0 0 15px;
	list-style-type: square;
} 

#soRightHandLinks table li a { 
	display: inline;
	margin: 0;
	padding: 0;
	color: #00c;
	text-decoration: underline;
}

#soRightHandLinks table a, #soRightHandLinks table li a, #soRightHandLinks table a:visited, #soRightHandLinks table li a:visited {
	display: inline;
	color: #00c;
	text-decoration: underline;
}

#soRightHandLinks table a:hover, #soRightHandLinks table li a:hover {
	color: #fff;
	text-decoration: none;
	background-color: #000;
}

#soRightHandLinks img {
	display: block;
	text-align: center;
	margin: auto;
	max-width:180px;
}


/**********************************/
/** for Garbage collection calendars **/

#tableWrap {display: block; height: auto; font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;  padding: 3px; width: 729px; }
#serviceLevelTextArea table.calMonth { 
	margin: 0; 
	padding: 0;
	padding-right: 0; 
	list-style: none; 
	border-collapse: collapse; 
	background: #fff; 
	width: 100%;
}

#serviceLevelTextArea table.calMonth td, #serviceLevelTextArea table.calMonth th   { 
	width: 103px;
	margin: 0;
	padding: 0;
	border: 1px solid #999;
	border-collapse: collapse;
}

#serviceLevelTextArea table.calMonth td {height: 102px;}
#serviceLevelTextArea table.calMonth th {border: 2px solid #999; text-align: center;}
#serviceLevelTextArea tr.header {background: #fff; color: #000; height: 20px; font-weight: bold; }

/* to position text off screen for accessibility screen readers, no styles etc. */
#serviceLevelTextArea table.calMonth td span {position: absolute; left: -3000px; font-size: .7em;}

#serviceLevelTextArea table.calMonth td div {display: inline-block; width: 103px; margin: 0; padding: 0; clear: both;}

#serviceLevelTextAreatable.calMonth td div.date, #serviceLevelTextArea table.calMonth td  div.blankDate, #serviceLevelTextArea table.calMonth td  div.dateLG {  
	width: 20px;
	height: 16px; 
	text-align: right;
	padding: 2px; 
	border-right: 1px dotted red;
	border-bottom: 1px dotted red;
	font-size: .9em;
	margin-bottom: 7px;
}

#serviceLevelTextArea table.calMonth td  div.blankDate {border: none;}
#serviceLevelTextArea table.calMonth td  div.dateLG {  width: 50px; }

/* setting generic height for each image div */
div.infoGBin, div.infoNoCollectNextDay, div.we, div.infoSpacer, div.infoGBinNextDay, div.infoHhwDepot, div.infoGiveAway, div.infoGiveAwayAndHHW, div.infoNextDay, div.infoNextDayWE, div.infoNextDayGBinWE, div.infoNextDayGBinHhwWE, div.infoGBinRural, div.infoXMas, div.infoGBinRuralNextDay, div.infoGBinRuralNextDayWE, div.infoGbinXMas { height: 55px;  }
 
/*  to create the background images for each cell  */ 
div.infoGBin {background: url(http://ottawa.ca/images/collectionCalendar/gBin.jpg) no-repeat;}
div.infoNextDay {background: url(http://ottawa.ca/images/collectionCalendar/nextDay.jpg) no-repeat;}
div.infoNextDayWE {background: url(http://ottawa.ca/images/collectionCalendar/nextDayWE.gif) no-repeat;}
div.infoGBinNextDay {background: url(http://ottawa.ca/images/collectionCalendar/gBinNextDay.jpg) no-repeat;}
div.infoNextDayGBinWE {background: url(http://ottawa.ca/images/collectionCalendar/nextDayGBinWE.gif) no-repeat;}
div.infoNextDayGBinHhwWE {background: url(http://ottawa.ca/images/collectionCalendar/nextDayGBinHhwWE.gif) no-repeat;} 
div.infoNoCollectNextDay {background: url(http://ottawa.ca/images/collectionCalendar/noCollectNext.jpg) no-repeat;}
div.infoGBinRuralNextDay {background: url(http://ottawa.ca/images/collectionCalendar/gBinRuralNextDay.jpg) no-repeat;} 
div.infoGBinRuralNextDayWE {background: url(http://ottawa.ca/images/collectionCalendar/gBinRuralNextDayWE.gif) no-repeat;} 
div.infoHhwDepot {background: url(http://ottawa.ca/images/collectionCalendar/hhwDepot.gif) no-repeat;}
div.infoGiveAway {background: url(http://ottawa.ca/images/collectionCalendar/giveAway.gif) no-repeat;}
div.infoGiveAwayAndHHW {background: url(http://ottawa.ca/images/collectionCalendar/giveAwayAndHHW.gif) no-repeat;} 
div.infoGBinRural {background: url(http://ottawa.ca/images/collectionCalendar/greenBinRural.gif) no-repeat;} 
div.infoXMas {background: url(http://ottawa.ca/images/collectionCalendar/xmasTree.gif) no-repeat;} 
div.infoGbinXMas {background: url(http://ottawa.ca/images/collectionCalendar/gBinXmasTree.jpg) no-repeat;} 
div.infoXLYWGBin {background: url(http://ottawa.ca/images/collectionCalendar/new/exLYWGreenBin.gif) no-repeat;}
div.infoLYWGBin {background: url(http://ottawa.ca/images/collectionCalendar/LYWGreenBin.gif) no-repeat;}

.we {background-color: #E8F7F5;}

/*  to create links on images for special days  */
.infoGiveAway a, .infoHhwDepot a {position: absolute; width: 100px; height: 60px;}
.infoGiveAwayAndHHW a {float: left; width: 50px; height: 60px;}
.infoNextDayGBinHhwWE a.hhw {float: right; width: 40px; height: 60px;}

/*  blue and black box div info */
div.blue, div.black, div.blueBlackNone {width: 103px; height: 16px; color: #fff; text-align: center; font-size: .85em; }
div.blue {background: blue;}
div.black {background: black;}

#serviceLevelTextArea table.calMonth caption {background: red; 
	text-align: center; font-size: 1.5em; color: white; font-weight: bold; border: none; margin: 0; padding: 0;
	caption-side: top;}
	
#tableWrap, .calMonth caption {
    background-color: #00A88E;
}
.calMonth caption span {font-size: 160%; font-family: Tahoma, Geneva, sans-serif;}

/*** Month Nav at bottom of page *****/
.monthNav {width: 736px; text-align: center;}
.monthNav ul { list-style: none; font-size: .8em; margin: 5px auto; padding: 0; }
.monthNav li {display: inline; margin: 0; padding: 0 4px;  }
.monthNav li a:after {content:" . "; position: relative; bottom: 3px; font-size: 200%; line-height: 20px;}
.monthNav li.last {border-right: none;}
.monthNav li.last a:after {content: "";}
.monthNav li a {text-decoration: none;}

/** For GC Calendar legend **/
#serviceLevelTextArea div.calLegend table, #serviceLevelTextArea div.calLegend table th, #serviceLevelTextArea div.calLegend table td  {border: 1px solid black; border-collapse: collapse;}
#serviceLevelTextArea div.calLegend table th, #mainBodyServiceArea div.calLegend table td  {margin: 0; padding: 2px;}
#serviceLevelTextArea div.calLegend table th {background-color: #999; color: white; text-align: left;}
#serviceLevelTextArea div.calLegend table img {height: 60%; width: 60%;}
#serviceLevelTextArea div.calLegend table tr td:first-child {width: 75px;}


/** For Recycling Waste Explorer **/
#recycleheader { margin:1em 0; background:url(http://ottawa.ca/online_services/recycling/images/banner_recycling_en_760.png) no-repeat left top; -moz-border-radius-topright:5px; -webkit-border-top-right-radius:5px; border-top-right-radius:5px; -moz-border-radius-topleft:5px; -webkit-border-top-left-radius:5px; border-top-left-radius:5px; }
#recycleheaderfr { margin:1em 0; background:url(http://ottawa.ca/online_services/recycling/images/banner_recycling_fr_760.png) no-repeat right top; -moz-border-radius-topright:5px; -webkit-border-top-right-radius:5px; border-top-right-radius:5px; -moz-border-radius-topleft:5px; -webkit-border-top-left-radius:5px; border-top-left-radius:5px;}
#featured { margin:0; padding-top:1.75em; }
.tabs-nav { height:2.1em; margin:0; padding:0;  bottom:-1px; list-style:none; position:relative; }
#serviceLevelTextArea ul.tabs-nav { margin:0; }
.tabs-nav li { height:27px;float:left; margin:0; padding:0; }
.tabs-nav li a { float:left; padding:.3em 1.4em .4em; cursor:pointer; text-decoration:none; border:1px solid #aaa; border-bottom:0; background: url(../images/bg-tab.png) 50% 50% repeat-x; margin-right:-1px; color:#222; text-decoration: underline; color: #336699;}
.tabs-nav li a:hover {  }
.tabs-nav li.tabs-selected { }
.tabs-nav li.tabs-selected a { position:relative; background:#eee; padding-top:.5em; margin-top:-.2em; font:1em bold arial,helvetica; border:1px solid #aaa;border-bottom:1px solid #eee; -moz-border-radius-topright:5px; -webkit-border-top-right-radius:5px; border-top-right-radius:5px; -moz-border-radius-topleft:5px; -webkit-border-top-left-radius:5px; border-top-left-radius:5px; text-decoration: underline; color: #336699;}
.tabs-body { clear:both; overflow:auto; border-bottom:1px solid #aaa; border-left:1px solid #aaa; border-right:1px solid #aaa; width:758px; background:#ddd url(../images/bg-tab-body.png) 50% bottom repeat-x;  -moz-border-radius-bottomright:5px; -webkit-border-bottom-right-radius:5px; border-bottom-right-radius:5px; -moz-border-radius-bottomleft:5px; -webkit-border-bottom-left-radius:5px; border-bottom-left-radius:5px; }
.tabs-body div.tabs-panel { padding:15px 25px; overflow:auto; display:none; font-size:1.2em; }
.tabs-body div.tabs-panel-selected { padding:15px 25px;display:block; }
.tabs-body div.tabs-panel h2 { font-size:1em; margin-bottom:8px; }
.tabs-body div.tabs-panel ul,dl { margin:0; padding:0; list-style:none; }
.tabs-body div.tabs-panel ul li { margin-bottom:3px; }
.tabs-body div.tabs-panel dl dt { color:#777; display:block; float:left; text-align:right; width:80px; margin:2px 15px 3px 0; text-transform:uppercase; font-size:80%; font-weight:bold; }
.tabs-body div.tabs-panel dl dd { margin:0 0 2px; display:block; border-top:1px solid #ddd; }

/*** For Visitors ***/
.cols {
	width:180px;
	height:150px;
	text-align:center;
}
.thumbNav {
	display:none;
}
.boldTxt {
	font-weight:bold;
}


/** Generic Fixes **/
.clearBoth, .clearLeft, .clearRight {
    border-bottom: 1px solid #DCDCF5;
    display: block;
    height: 10px;
    margin-bottom: 15px;
}

.clearLeft {clear: left;}
.clearRight {clear: right;}
.clearBoth {clear: both;}

.clearLeft hr, .clearRight hr, .clearBoth hr  {display: none;}

/** for intercept survey ***/
#surveyMsg #surveyCloseBtn{float:right;}
#surveyMsg{display:none;padding:10px;}
#surveyMsg .blockMsg{-moz-border-radius: 8px;-webkit-border-radius: 8px;border-radius:8px;}